import 'package:flutter/material.dart';

class MyApp17 extends StatelessWidget {
  const MyApp17({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GridView的基本使用'),
        backgroundColor: const Color.fromARGB(255, 232, 221, 10),
      ),
      body: GridView(
        gridDelegate:
        // 固定大小
        // SliverGridDelegateWithMaxCrossAxisExtent(maxCrossAxisExtent: 200),
        // 固定侧轴(水平)方向子元素的个数，无论如何旋转屏幕侧轴子元素个数永远不变
        const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3, // 1.1 设置侧轴方向子元素个数，此时每行展示的子元素个数是固定的
          mainAxisSpacing: 10.0, // 1.2 主轴(垂直)方向子元素间距
          crossAxisSpacing: 5.0, // 1.3 侧轴(水平)方向子元素间距
          childAspectRatio: 1 / 1, // 1.4 子元素宽高比，默认宽高相同 1: 1
        ),
        children: [
          Container(color: Colors.amber, child: Text('1')),
          Container(color: Colors.black, child: Text('1')),
          Container(color: Colors.blue, child: Text('1')),
          Container(color: Colors.blueGrey, child: Text('1')),
          Container(color: Colors.brown, child: Text('1')),
          Container(color: Colors.cyan, child: Text('1')),
          Container(color: Colors.cyanAccent, child: Text('1')),
        ],
      ),
    );
  }
}
